css | 您所在的位置:网站首页 › ie11 svg › css |
我有一个非常简单的加载动画,可以在 Firefox 和 Chrome 上完美运行,但在 IE11 中它不显示 SVG 图。 这是完整的例子: JSFiddle sample SVG: 动画是一个旋转,在 IE11 上工作,但是 SVG,它是一个圆圈,没有被显示。 有什么想法吗? 我只是想不通 IE11 不支持什么。 最佳答案 只有 Microsoft Edge 将支持 SVG CSS 过渡和动画。尤其是 stroke-dasharray。 请参阅 Microsoft 开发人员文档: https://dev.windows.com/en-us/microsoft-edge/platform/status/csstransitionsanimationsforsvgelements Allows CSS Transitions and Animations to apply to SVG elements. Unprefixed version: Microsoft Edge build 10240+ 正如您在我的示例中看到的那样。由于 circle 元素上没有 stroke 属性,您没有看到加载程序旋转。 https://jsfiddle.net/z8w4vuau/50/ 您现在可以看到它是如何旋转的。但是您必须检查浏览器是否为 IE 并调整您的 stroke-dasharray 使其更大。由于 IE11 及更低版本不支持使用 CSS 动画或过渡对 SVG stroke-dasharray 和 stroke-dashoffset 进行动画处理,除非是 Microsoft Edge build 10240+。 但如果您需要一个跨浏览器解决方案来为 SVG 设置动画,尤其是 stroke-dasharray 和 stroke-dashoffset,那么请考虑使用 JS 动画库,例如 GreenSock Animation Platform ( GSAP)。使用 DrawSVGPlugin https://greensock.com/drawSVG 关于css - SVG 动画不适用于 IE11,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33812303/ |
CopyRight 2018-2019 实验室设备网 版权所有 |